<template>
  <div class="shop">
    <el-button style=" " size="mini" type="primary" @click="addPartner">新增合伙人</el-button>
    <div style="float: right;">
      <el-button style="float:right;" size="mini" type="primary" @click="searchArea">搜索</el-button>
      <el-input style="float:right;width:164px;" size="mini" placeholder="输入合伙人账号搜索" v-model="mobile"></el-input>

      <el-cascader style="width:130px;float:right;" placeholder="请选择地区" size="mini" :options="options"
        v-model="equipmentdistrict" @change="handleChange">
      </el-cascader>
      <span style="float:right;margin-top:4px;color:#666;margin-right:8px;margin-left:12px;">所属区域</span>

      <el-select style="width:130px;float:right;" v-model="status" size="mini" filterable>
        <el-option value="0" label="已入驻"></el-option>
        <el-option value="1" label="已禁用"></el-option>
        <el-option value="2" label="已删除"></el-option>
        <el-option value="3" label="已锁定"></el-option>

      </el-select>
      <span style="float:right;margin-top:4px;color:#666;margin-right:8px;">账号状态</span>

      <el-select style="width:130px;float:right;" v-model="partnerType" size="mini" filterable clearable
        placeholder="是否特通">
        <el-option value="2" label="特通"></el-option>
        <el-option value="1" label="非特通"></el-option>
      </el-select>
    </div>

    <el-table :data="tableData" style="width:100%;margin:40px 0;" max-height="680" :cell-style="tc"
      :header-cell-style="tccolor">
      <el-table-column label="ID" prop="id"></el-table-column>
      <el-table-column label="合伙人账号" prop="account"></el-table-column>
      <el-table-column label="管理区域" width="280">
        <template slot-scope="scope">
          <p v-if="scope.row.regionList.length">
            {{ scope.row.regionList[0].path }}
            <span style="cursor:pointer;color:#f4222d;" @click="watchAllAreas(scope.row)">(查看全部)</span>
          </p>
          <p v-else>----</p>

        </template>
      </el-table-column>
      <el-table-column label="联系人" prop="selfName">
        <template slot-scope="scope">
          <p v-if="scope.row.registerType == 1">{{ scope.row.companyContact }}</p>
          <p v-if="scope.row.registerType == 2">{{ scope.row.selfName }}</p>
          <p v-if="scope.row.registerType == 0">待定</p>
        </template>
      </el-table-column>
      <el-table-column label="入驻时间" prop="createTime">
        <template slot-scope="scope">
          {{ parseTime(scope.row.createTime) }}
        </template>
      </el-table-column>
      <!-- <el-table-column label="直邀乐粉">
      <template slot-scope="scope">
         {{scope.row.fans_count}}<span style="cursor:pointer;color:#f4222d;" v-if="scope.row.fans_count != 0" @click="watchFans(scope.row.uid)">(查看)</span>
      </template>
    </el-table-column>
    <el-table-column label="直邀小店">
      <template slot-scope="scope">
         {{scope.row.shop_count}}<span style="cursor:pointer;color:#f4222d;" v-if="scope.row.shop_count != 0" @click="watchShop(scope.row.uid)">(查看)</span>
      </template>
    </el-table-column>
    <el-table-column label="直邀服务商" width="100">
      <template slot-scope="scope">
         {{scope.row.invitation_count}}<span style="cursor:pointer;color:#f4222d;" v-if="scope.row.invitation_count != 0" @click="watchInvitation(scope.row.uid)">(查看)</span>
      </template>
      </el-table-column>-->
      <el-table-column label="合伙人状态">
        <template slot-scope="scope">
          <p v-if="scope.row.status == 0" style="color:red">已入驻</p>
          <p v-if="scope.row.status == 1" style="color:green">已禁用</p>
          <p v-if="scope.row.status == 2">已删除</p>
          <p v-if="scope.row.status == 3">已锁定</p>
        </template>
      </el-table-column>
      <el-table-column label="操作" fixed="right" width="660">
        <template slot-scope="scope">
          <el-button size="mini" @click="editAreaDetail(scope.row.id)">编辑</el-button>
          <el-button size="mini" @click="watchWhaleStore(scope.row.id)">幕后小店</el-button>
          <el-button size="mini" @click="watchServiceOrder(scope.row.id)">服务订单</el-button>
          <el-button size="mini" @click="showRedpacketList(scope.row)">红包记录</el-button>
          <el-button size="mini" @click="watchSonAccount(scope.row.id)">子账号</el-button>
          <el-button size="mini" @click="disableAreaPeopleJudge(scope.row)">
            <span :style="scope.row.status == 0 ? 'color:green' : 'color:red'">{{ scope.row.status == 0 ? '启用' : '禁用'
              }}</span>
          </el-button>
          <el-button size="mini" type="danger" @click="linkcode(scope.row.inviteShopCodeUrl)">
            下载推广码
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <div class="pagination">
      <el-pagination background @current-change="pageChange" :current-page="page" :page-size="size"
        layout="total, prev, pager, next, jumper" :total="total"></el-pagination>
    </div>

    <jdialog title="新增合伙人" :visible.sync="showAddpartner" width="40%">

      <div style="padding:20px;">
        <el-form :model="formData" :rules="rulesAdd" ref="formAdd" label-width="100px" class="formAdd">
          <el-row>
            <el-col :span="12">
              <el-form-item label="合伙人类型" prop="registerType">
                <el-radio v-model="formData.registerType" :label="1" @change="changeRadio">企业</el-radio>
                <el-radio v-model="formData.registerType" :label="2" @change="changeRadio">个人</el-radio>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="合伙人类型" prop="partnerType">
                <el-radio v-model="formData.partnerType" :label="1" @change="changeDirect">区域合伙人</el-radio>
                <el-radio v-model="formData.partnerType" :label="2" @change="changeDirect">特通合伙人</el-radio>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <div style="margin-bottom:20px;" v-if="!isDirect">
                <div style="display: flex; ">
                  <div>
                    <span style="color:red;margin-right:4px;">*</span>
                    <span style="margin-right:12px;">代理区域:</span>
                  </div>
                  <el-button size="mini" @click="selectPartnerArea">请选择代理区域</el-button>
                </div>


                <div v-if="region_id_arr.count != 0">
                  <div v-for="(name, index) in region_arr" :key="'p' + index"
                    style="border:1px solid #999;margin-left:96px;text-align:center;height:28px;line-height:28px;margin-bottom:12px;width:270px;  border-radius: 4px;">
                    {{ province_arr[index] }}.{{ city_arr[index] }}.{{ region_arr[index] }}
                    <i class="el-icon-remove-outline" @click="detailSelect(index)"></i>
                  </div>
                </div>

              </div>
            </el-col>
            <!-- <el-col :span="8">
              <el-form-item label="合伙人账号" prop="account">

                <el-input size="mini" placeholder="请输入合伙人账号" v-model="formData.account"></el-input></el-form-item>
            </el-col> -->
            <el-col :span="24">
              <el-form-item label="合伙人端账号" prop="memberId">
                <el-select v-model="formData.memberId" filterable remote reserve-keyword placeholder="请输入绑定会员id"
                  :remote-method="getMemberList" :loading="loading" @change="cheangeMemberId">
                  <el-option v-for="item in memberIdList" :key="item.id" :label="item.mobile + ':' + item.nickName"
                    :value="item.id">
                  </el-option>
                </el-select>
                <!-- <el-input size="mini" placeholder="请输入合伙人app端账号id" v-model="formData.memberId"></el-input> -->

              </el-form-item>
            </el-col>
            <el-col :span="12" v-show="isCompany">
              <el-form-item label="公司名称" prop="companyName">
                <!-- <span style="margin-right:12px;margin-left:24px;">公司名称:</span> -->
                <el-input size="mini" placeholder="请输入公司名称" v-model="formData.companyName"></el-input></el-form-item>
            </el-col>
            <el-col :span="12" v-show="isCompany">
              <el-form-item label="法人姓名" prop="companyLegalname">
                <!-- <span style="margin-right:12px;margin-left:24px;">法人姓名:</span> -->
                <el-input size="mini" placeholder="请输入法人姓名" v-model="formData.companyLegalname"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24" v-show="!isCompany">
              <el-row>
                <el-col :span="12"> <el-form-item label="联系人" prop="selfName">
                    <el-input size="mini" placeholder="请输入联系人" v-model="formData.selfName"></el-input>
                  </el-form-item></el-col>
                <el-col :span="12">
                  <el-form-item label="联系电话" prop="selfPhone">
                    <el-input size="mini" placeholder="请输入电话" v-model="formData.selfPhone"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-col>
            <el-col :span="24" v-show="isCompany">
              <el-row>
                <el-col :span="12"> <el-form-item label="联系人" prop="companyContact">
                    <el-input size="mini" placeholder="请输入联系人" v-model="formData.companyContact"></el-input>
                  </el-form-item></el-col>
                <el-col :span="12">
                  <el-form-item label="联系电话" prop="companyPhone">
                    <el-input size="mini" placeholder="请输入电话" v-model="formData.companyPhone"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-col>

            <el-col :span="24">
              <el-row>
                <el-col :span="12"><el-form-item label="联系住址" prop="equipmentdistrict">
                    <el-cascader placeholder="请选择地区" size="mini" :options="options" v-model="equipmentdistrict"
                      @change="handleChanges">
                    </el-cascader>
                  </el-form-item></el-col>
                <el-col :span="12"><el-form-item label="详细地址" prop="address">
                    <el-input size="mini" placeholder="请输入详细地址" v-model="formData.address"></el-input>
                  </el-form-item></el-col>
              </el-row>


            </el-col>
            <el-col :span="24">
              <el-row>
                <el-col :span="8"><el-form-item label="加盟费" prop="franchiseFee">
                    <el-input size="mini" v-model="formData.franchiseFee"></el-input>
                  </el-form-item></el-col>
                <el-col :span="8"><el-form-item label="实收款" prop="franchisePaid">
                    <el-input size="mini" v-model="formData.franchisePaid"></el-input></el-form-item></el-col>
                <el-col :span="8"> <el-form-item label="待收款" prop="franchiseUnpaid">
                    <el-input size="mini" v-model="formData.franchiseUnpaid"></el-input></el-form-item></el-col>
              </el-row>

              <!-- <span style="margin-right:12px;margin-left:12px;">实收款:</span> -->

              <!-- <span style="margin-right:12px;margin-left:12px;">待收款:</span> -->

            </el-col>
            <el-col :span="8" v-show="isCompany">
              <el-form-item label="合伙人有效期" prop="endTime">
                <!-- <span style="margin-right:12px;margin-left:24px;">法人姓名:</span> -->
                <!-- <el-date-picker v-model="formData.endTime"
                                    type="date"
                                    style="width:136px"
                                    value-format="yyyy-MM-dd"
                                    placeholder="选择结束时间"></el-date-picker> -->
                <el-input size="mini" placeholder="请输入合伙人有效期" v-model="formData.endTime"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="16" v-show="isCompany">
              <el-form-item label="支付类型" prop="transferWay">
                <!-- <span style="margin-right:12px;margin-left:24px;">法人姓名:</span>0-未选择 1-支付宝 2-银联 -->
                <el-radio-group v-model="formData.transferWay">
                  <el-radio :label="0">未选择</el-radio>
                  <el-radio :label="1">支付宝</el-radio>
                  <el-radio :label="2">银联</el-radio>
                </el-radio-group>
                <!-- <el-input size="mini"  placeholder="请输入合伙人有效期" v-model="formData.transferWay"></el-input> -->
              </el-form-item>
            </el-col>
            <el-col :span="24" v-if="isCompany">
              <el-row>
                <el-col :span="8">
                  <el-form-item label="电子合同" prop="contracts">
                    <pic-sel style="float:left" v-model="formData.contracts" />
                  </el-form-item>
                </el-col>
                <el-col :span="16">
                  <el-form-item label='合同时间:'>
                    <el-date-picker v-model="formData.contractsStart" type="date" style="width:136px"
                      value-format="yyyy-MM-dd" placeholder="选择开始时间">
                    </el-date-picker>
                    ~
                    <el-date-picker v-model="formData.contractsEnd" type="date" style="width:136px"
                      value-format="yyyy-MM-dd" placeholder="选择结束时间"></el-date-picker>
                  </el-form-item>
                </el-col>


              </el-row>
            </el-col>

            <el-col :span="24" v-if="isCompany">
              <el-row>
                <el-col :span="8">
                  <el-form-item label="身份证正面" prop="companyLegalFrontcard">
                    <pic-sel style="float:left" v-model="formData.companyLegalFrontcard" />
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="身份证反面" prop="companyLegalBackcard">
                    <pic-sel style="float:left" v-model="formData.companyLegalBackcard" />
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="营业执照" prop="companyLicense">
                    <pic-sel style="float:left" v-model="formData.companyLicense" />
                  </el-form-item>
                </el-col>

              </el-row>



            </el-col>
            <el-col :span="24" v-if="!isCompany">
              <el-form-item label="身份证" prop="selfFrontCard">
                <pic-sel style="float:left" v-model="formData.selfFrontCard" />
              </el-form-item>
              <el-form-item label="身份证" prop="selfBackCard">
                <pic-sel style="float:left" v-model="formData.selfBackCard" />
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="备注" prop="remark">
                <el-input size="mini" type="textarea" placeholder="请输入备注"
                  v-model="formData.remark"></el-input></el-form-item>
            </el-col>
            <el-col :span="24">
              <div style="text-align:center;">
                <el-button size="mini" type="primary" @click="certainAddPartner">确定</el-button>
                <el-button size="mini" @click="cancelAddPartner">取消</el-button>
              </div>
            </el-col>



          </el-row>
        </el-form>
      </div>
    </jdialog>

    <jdialog title="请选择代理区域" :visible.sync="showDailiArea" width="480px">
      <div style="height:560px;width:100%;">
        <div style="width:140px;height:100%;background-color:#f5f5f5;float:left;">
          <div v-for="(item, index) in provinceList" :key="'s' + index"
            style="width:100%;height:42px;text-align:center;line-height:42px;cursor:pointer;"
            @click="onChangeDailiProvinceIds(index)">
            <div style="float:left;width:4px;height:100%;background-color:#f4222d;" v-if="province_add_id == item.id">
            </div>
            {{ item.name }}
            <p style="color:#999;float:right;">></p>
          </div>
        </div>

        <div style="width:160px;height:100%;float:left;">
          <div v-for="(item, i) in cityList" :key="'c' + i"
            style="width:100%;height:42px;text-align:center;line-height:42px;cursor:pointer;"
            @click="onChangeDailiCityIds(i)">
            {{ item.name }}
            <p style="color:#999;float:right;">></p>
          </div>
        </div>

        <div style="width:180px;height:100%;float:left;">
          <div v-for="(item, index) in areaList" :key="'r' + index"
            style="width:100%;height:42px;text-align:center;line-height:42px;">
            {{ item.name }}
            <div
              style="background-color:#fff;float:right;border:2px solid #f4222d;color:#f4222d;width:14px;height:14px;margin-top:15px;margin-right:12px;cursor:pointer;"
              v-if="region_add_id == item.id">
              <i class="el-icon-check"></i>
            </div>
            <div
              style="background-color:#fff;float:right;border:2px solid #f4222d;width:14px;height:14px;margin-top:15px;margin-right:12px;cursor:pointer;"
              v-else @click="selectPartnerRegions(item.code, item.name)"></div>
          </div>
        </div>
      </div>
    </jdialog>

    <!--展示全部区域-->
    <jdialog :title="addTitle" :visible.sync="isShowAddRecharge" width="400px">
      <div>
        <div v-for="(item, index) in areaMangerList" :key="index" class="forAreas">
          <span>{{ index + 1 }}</span>
          {{ item.path }}
        </div>
      </div>
    </jdialog>

    <jdialog title="红包充值记录" :visible.sync="isShowRedpacketList" width="1000px">
      <redpacket :formData.sync="userForm" :uid='memberId'></redpacket>
    </jdialog>
  </div>
</template>

<script>
import { partnerPageList, partnerUpdate, partnerAdd, partnerDetail, partnerDelete, partnerStatistics, partnerRegionTreeList } from '@/api/area.js'
import redpacket from "@/components/redpacket";
import { regionData, codeToText } from 'element-china-area-data'
import { useCascaderAreaData } from '@vant/area-data';
import {
  member_list
} from '@/api/member'
export default {
  components: {
    'pic-sel': () => import('../../components/PicSel/index'),
    redpacket
  },
  created() { },
  mounted() {
    //  this.provinceId = this.$route.query.region_id
    // this.getProvinceDataList("1", "0");
    this.getproviderRegionProvinceListData()
    this.getpartnerProvinceSearchData();
    this.regionData = useCascaderAreaData()

  },
  data() {
    return {
      rulesAdd: {
        username: [
          { required: true, message: '用户名必填', trigger: 'blur' },
        ],
        type: [
          { required: true, message: '类型必需选择', trigger: 'blur' },
        ],
        roleIds: [
          { required: true, message: '角色必需选择', trigger: 'blur' },
        ],
      },
      codeToTexts: codeToText,
      options: useCascaderAreaData(),
      equipmentdistrict: "",
      province_id: "",
      city_id: "",
      region_id: "",
      mobile: "",
      status: 0,
      tableData: [],
      total: 0,
      page: 1,
      size: 20,
      keyword: '',
      partnerId: 0,
      sellerId: 0,
      partnerType: undefined,
      search: '',
      areaList: [],
      cityList: [],
      provinceList: [],

      isShowAddRecharge: false,
      //新增合伙人
      showAddpartner: false,
      //合伙人类型
      partner_type: "",
      //合伙人账号
      username: "",
      //公司名称
      company_name: "",
      //法人姓名
      company_legalname: "",
      //联系人
      company_contact: "",
      //联系电话
      company_phone: "",
      //地址
      province_id_address: "",
      city_id_address_list: [],
      city_id_address: "",
      region_id_address_list: [],
      region_id_address: "",
      address: "",
      //加盟费
      initial_money: "",
      actual_money: "",
      wait_money: "",
      company_license: "",
      self_front_card: "",

      //代理区域
      showDailiArea: false,
      addTitle: "代理区域详情",
      areaMangerList: [],
      region_id_arr: [],
      region_arr: [],

      city_id_arr: [],
      city_arr: [],

      province_id_arr: [],
      province_arr: [],

      province_add_id: "",
      province_add_name: "",

      city_add_id: "",
      city_add_name: "",
      city_add_list: [],

      region_add_id: "",
      region_add_name: "",
      regin_add_list: [],
      // 添加合伙人
      isCompany: true,
      is_direct: "2",
      isDirect: false,
      type: undefined,
      userForm: {
        id: 0
      },
      isShowRedpacketList: false,
      cityCode: '',
      provinceCode: '',
      countyCode: '',
      memberIdList: [],
      memberId: 0,
      loading: false,
      formData: {
        id: 0,
        account: '',
        memberId: 0,
        accountPassword: '123456',
        provinceCode: 0,
        cityCode: 0,
        districtCode: 0,
        partnerType: 1,
        registerType: 1,
        selfName: '',
        selfPhone: '',
        selfFrontCard: '',
        selfBackCard: '',
        companyName: '',
        companyLicense: '',
        companyLegalname: '',
        companyLegalFrontcard: '',
        companyLegalBackcard: '',
        companyContact: '',
        companyPhone: '',
        endTime: 1,
        transferWay: 0,
        remark: '',
        address: '',
        regionCodes: [],
        franchiseFee: 0,
        franchisePaid: 0,
        franchiseUnpaid: 0,
        contracts: '',
        contractsStart: '',
        contractsEnd: '',
      }
    };
  },
  methods: {
    async linkcode(code) {
      try {
        window.open(code, '_blank');
      } catch (error) {
        this.$message.error('下载失败，请稍后再试');
      }

    },
    cheangeMemberId(e) {

      let item = this.memberIdList.find(item => item.id === e)
      console.log(item.mobile)
      this.formData.account = item.mobile
    },
    // 搜索指定会员id
    getMemberList(e) {
      console.log(e)
      if (e) {
        let data = {
          keyword: e
        }
        member_list(data).then(res => {
          console.log(res)
          this.memberIdList = res.data.list
        })
      }

    },
    handleChange(value) {
      console.log('value', value)
      this.cityCode = value[1]
      this.provinceCode = value[0]
      this.countyCode = value[2]
    },
    handleChanges(value) {
      console.log('value', value, this.options)
      let province = this.options.find(item => item.value == value[0])
      let city = this.options.find(item => item.value == value[1])
      let district = this.options.find(item => item.value == value[2])
      // console.log(abc)



      this.formData.cityCode = value[1]
      this.formData.provinceCode = value[0]
      this.formData.districtCode = value[2]
    },
    changeRadio(e) {
      if (e == 1) {
        this.isCompany = true;
      } else {
        this.isCompany = false;
      }
    },
    changeDirect(e) {
      // alert(e)
      if (e == 2) {
        this.isDirect = true;
      } else {
        this.isDirect = false;
      }
    },
    pageChange(page) {
      this.page = page;
      this.getpartnerProvinceSearchData();
    },
    searchArea() {
      this.page = 1;
      this.getpartnerProvinceSearchData();
    },
    onChangeProvince(id) {
      this.city_id = this.region_id = "";
      this.getProvinceDataList("2", id);
    },
    onChangeCity(id) {
      this.region_id = "";
      this.getProvinceDataList("3", id);
    },
    async getproviderRegionProvinceListData() {
      console.log('请求大区列表')
      let res = await partnerRegionTreeList({ level: 1 })
      if (res.code === 200) {
        this.provinceList = res.data
        console.log(this.provinceList, '省。。。。')
      } else {
        this.$message.error(res.message)
      }
    },
    async getProvinceDataList(t, p) {
      let res = await provinceCityArea({ type: t, pid: p });

      if (res.code === 200) {
        if (t === "1") {
          this.provinceList = res.data;
          if (this.provinceList.length > 0) {
            this.province_add_id = this.provinceList[0].id;
            this.province_add_name = this.provinceList[0].name;
            this.getProvinceDataListAddDaili("2", this.province_add_id);
          }
        } else if (t === "2") {
          this.cityList = res.data;
        } else {
          this.areaList = res.data;
        }
      }
    },
    //获取列表接口
    async getpartnerProvinceSearchData() {
      var url = {
        // city_id: this.city_id,
        // region_id: this.region_id,
        mobile: this.mobile,
        pageNum: this.page,
        pageSize: this.size,
        status: this.status,
        provinceCode: this.provinceCode,
        cityCode: this.cityCode,
        districtCode: this.districtCode,
        keyword: this.keyword,
        partnerId: this.partnerId,
        sellerId: this.sellerId,
        partnerType: this.partnerType,
        search: this.search
      };


      // keyword
      // partnerId
      // sellerId
      // partnerType
      // provinceCode
      // cityCode
      // districtCode
      // search





      let res = await partnerPageList(url);
      if (res.code === 200) {
        this.tableData = res.data.list;
        console.log(this.tableData, '###########');
        this.total = res.data.total;
      } else {
        this.$message.error(res.message);
      }
    },
    // 查看全部管理区域
    async watchAllAreas(row) {
      // let res = await partnerProvinceAreas(id);
      // console.log(res);
      this.isShowAddRecharge = true;
      this.areaMangerList = row.regionList;
      console.log(this.areaMangerList);
    },
    //幕后街
    watchWhaleStore(id) {
      this.$router.push({
        path: "./../ISP/ispPartnerShop",
        // query: { serviceId: id }
        // name: "management_shoplist",
        query: { serviceId: id }
      });
    },
    //服务订单
    watchServiceOrder(id) {
      this.$router.push({
        path: "./isServiceOrder",
        query: { serviceId: id }
      });
    },
    //红包记录
    watchRedpacketRecord(id) {
      this.$router.push({
        path: "./ispRedPacket",
        query: { serviceId: id }
      });
    },
    watchFans(id) {
      this.$router.push({
        path: "./ispAreaDetailFanshopPar",
        query: {
          serviceId: id,
          type: "third"
        }
      });
    },
    watchShop(id) {
      this.$router.push({
        path: "./ispAreaDetailFanshopPar",
        query: {
          serviceId: id,
          type: "first"
        }
      });
    },
    watchInvitation(id) {
      this.$router.push({
        path: "./ispAreaDetailFanshopPar",
        query: {
          serviceId: id,
          type: "second"
        }
      });
    },
    //编辑
    editAreaDetail(id) {
      this.$router.push({
        path: "./ispAreaPartnerEditdetail",
        query: {
          partner_id: id
        }
      });
    },
    //子账号
    watchSonAccount(id) {
      this.$router.push({
        path: "./ispAreaChildrenAccount",
        query: {
          uid: id
        }
      });
    },
    //禁用
    async disableAreaPeople(row) {
      var data = row;
      data.status = 1;
      let res = await partnerUpdate(data);
      if (res.code == 200) {
        this.getpartnerProvinceSearchData();
      } else {
        this.$message.error(res.message);
      }
    },
    async disableAreaPeopleJudge(uid) {
      this.$confirm("确认禁用该合伙人吗", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.disableAreaPeople(uid);
        })
        .catch(() => { });
    },

    //新增合伙人
    addPartner() {
      this.showAddpartner = true;
    },

    onChangeProForAddress(id) {
      this.city_id_address = this.region_id_address = "";
      this.getProvinceDataListAddress("2", id);
    },
    onChangeCiAddress(id) {
      this.region_id_address = "";
      this.getProvinceDataListAddress("3", id);
    },

    async getProvinceDataListAddress(t, p) {
      let res = await provinceCityArea({ type: t, pid: p });
      if (res.code === 200) {
        if (t === "1") {
          this.provinceList = res.data;
        } else if (t === "2") {
          this.city_id_address_list = res.data;
        } else {
          this.region_id_address_list = res.data;
        }
      }
    },
    selectPartnerArea() {
      this.showDailiArea = true;
      this.getproviderRegionProvinceListData()
    },
    selectPartnerRegions(id, name) {
      if (this.region_id_arr.length < 100) {
        if (this.region_id_arr.length == 0) {
          this.region_add_id = id;
          this.region_add_name = name;

          this.region_id_arr.push(id);
          this.region_arr.push(name);

          this.city_id_arr.push(this.city_add_id);
          this.city_arr.push(this.city_add_name);

          this.province_id_arr.push(this.province_add_id);
          this.province_arr.push(this.province_add_name);
          console.log(this.province_id_arr, this.region_id_arr, this.city_id_arr)
          this.formData.regionCodes = this.region_id_arr
          this.showDailiArea = false;
        } else {
          if (this.region_id_arr.indexOf(id) == -1) {
            this.region_add_id = id;
            this.region_add_name = name;

            this.region_id_arr.push(id);
            this.region_arr.push(name);

            this.city_id_arr.push(this.city_add_id);
            this.city_arr.push(this.city_add_name);

            this.province_id_arr.push(this.province_add_id);
            this.province_arr.push(this.province_add_name);
            this.formData.regionCodes = this.region_id_arr
            this.showDailiArea = false;




            console.log(this.province_id_arr, this.region_id_arr, this.city_id_arr)
          } else {
            this.$message.error("不能添加相同的代理区域");
          }
        }
      } else {
        this.$message.error("所选代理区域不能超出100个");
      }
    },
    selectPartnerRegion(id, name) {
      if (this.region_id_arr.length < 100) {
        if (this.region_id_arr.length == 0) {
          this.region_add_id = id;
          this.region_add_name = name;

          this.region_id_arr.push(id);
          this.region_arr.push(name);

          this.city_id_arr.push(this.city_add_id);
          this.city_arr.push(this.city_add_name);

          this.province_id_arr.push(this.province_add_id);
          this.province_arr.push(this.province_add_name);

          this.showDailiArea = false;
        } else {
          if (this.region_id_arr.indexOf(id) == -1) {
            this.region_add_id = id;
            this.region_add_name = name;

            this.region_id_arr.push(id);
            this.region_arr.push(name);

            this.city_id_arr.push(this.city_add_id);
            this.city_arr.push(this.city_add_name);

            this.province_id_arr.push(this.province_add_id);
            this.province_arr.push(this.province_add_name);

            this.showDailiArea = false;
          } else {
            this.$message.error("不能添加相同的代理区域");
          }
        }
      } else {
        this.$message.error("所选代理区域不能超出100个");
      }
    },
    //删除所选代理区域
    detailSelect(index) {
      this.region_add_id = "";
      this.region_add_name = "";
      this.region_id_arr.splice(index, 1);
      this.region_arr.splice(index, 1);
      this.province_arr.splice(index, 1);
      this.province_id_arr.splice(index, 1);
      this.city_arr.splice(index, 1);
      this.city_id_arr.splice(index, 1);
    },
    //新增合伙人
    // certainAddPartner() {

    // },
    //新增合伙人
    async certainAddPartner() {
      let res = await partnerAdd(this.formData);
      if (res.code === 200) {
        this.$message.success(res.message);
        this.cancelAddPartner();
        this.getpartnerProvinceSearchData();
      } else {
        this.$message.error(res.message);
      }
    },
    certainAddPartners() {
      if (!this.partner_type) {
        this.$message.error("请选择合伙人类型");
        return;
      }

      if (this.isDirect) {
        //特通
      } else {
        if (this.region_arr.length == 0) {
          this.$message.error("请选择代理区域");
          return;
        }

      }


      if (!this.username) {
        this.$message.error("合伙人账号不能为空");
        return;
      }

      if (!this.self_front_card) {
        this.$message.error("身份证不能为空");
        return;
      }

      if (!this.initial_money) {
        this.$message.error("加盟费不能为空");
        return;
      }
      if (!this.actual_money) {
        this.$message.error("实收款不能为空");
        return;
      }
      if (!this.wait_money) {
        this.$message.error("待收款不能为空");
        return;
      }

      if (!this.region_id_address) {
        this.$message.error("地址不能为空");
        return;
      }
      this.getaddAdminPartnerData();
    },
    cancelAddPartner() {
      this.showAddpartner = false;
      this.partner_type = "";
      //合伙人账号
      this.username = "";
      //公司名称
      this.company_name = "";
      //法人姓名
      this.company_legalname = "";
      //联系人
      this.company_contact = "";
      //联系电话
      this.company_phone = "";
      //地址
      this.province_id_address = "";
      this.city_id_address_list = [];
      this.city_id_address = "";
      this.region_id_address_list = [];
      this.region_id_address = "";
      this.address = "";
      //加盟费
      this.initial_money = "";
      this.actual_money = "";
      this.wait_money = "";
      this.company_license = "";
      this.self_front_card = "";

      //代理区域
      this.province_add_id = this.provinceList[0].id;
      this.province_add_name = this.provinceList[0].name;

      this.region_id_arr = [];
      this.region_arr = [];
      this.region_add_id = "";
      this.region_add_name = "";

      this.province_id_arr = [];
      this.province_arr = [];

      this.city_id_arr = [];
      this.city_arr = [];
      this.city_add_id = "";
      this.city_add_name = "";

      this.getProvinceDataListAddDaili("2", this.province_add_id);
    },
    onChangeDailiProvinceIds(index) {
      this.cityList = this.provinceList[index].children;
      this.province_add_id = this.provinceList[index].code;
      this.province_add_name = this.provinceList[index].name;
      this.regin_add_list = [];
      // this.getProvinceDataListAddDaili("2", id);
    },
    onChangeDailiProvinceId(id, name) {
      this.province_add_id = id;
      this.province_add_name = name;
      this.regin_add_list = [];
      this.getProvinceDataListAddDaili("2", id);
    },
    onChangeDailiCityIds(index) {
      this.areaList = this.cityList[index].children;
      this.city_add_id = this.cityList[index].code;
      this.city_add_name = this.cityList[index].name;
    },
    onChangeDailiCityId(id, name) {
      this.city_add_id = id;
      this.city_add_name = name;
      this.getProvinceDataListAddDaili("3", id);
    },

    async getProvinceDataListAddDaili(t, p) {
      let res = await provinceCityArea({ type: t, pid: p });
      if (res.code === 10000) {
        if (t === "1") {
          this.provinceList = res.data;
        } else if (t === "2") {
          this.city_add_list = res.data;
        } else {
          this.regin_add_list = res.data;
        }
      }
    },


    async getaddAdminPartnerData() {
      var form = {};
      var area1 = "";
      var city1 = "";
      var province1 = "";

      this.provinceList.map(item => {
        if (item.id == this.province_id_address) {
          province1 = item.name;
          return;
        }
      });

      this.city_id_address_list.map(cityItem => {
        if (cityItem.id == this.city_id_address) {
          city1 = cityItem.name;
          return;
        }
      });

      this.region_id_address_list.map(areaItem => {
        if (areaItem.id == this.region_id_address) {
          area1 = areaItem.name;
          return;
        }
      });
      // var arr = []
      var areaArr = [];
      this.region_id_arr.map((item, index) => {
        areaArr.push({
          region_id: item,
          region: this.region_arr[index],
          city: this.city_arr[index],
          city_id: this.city_id_arr[index],
          province: this.province_arr[index],
          province_id: this.province_id_arr[index]
        });
        // areaArr.push({region_id:item})
        // areaArr.push({region:this.region_arr[index]})

        // areaArr.push({city:this.city_arr[index]})
        // areaArr.push({city_id:this.city_id_arr[index]})
        // areaArr.push({province:this.province_arr[index]})
        // areaArr.push({})
        // arr.push(areaArr)
      });
      if (this.partner_type == 1) {
        form = {
          username: this.username,
          partner_type: 1,
          initial_money: this.initial_money,
          actual_money: this.actual_money,
          wait_money: this.wait_money,
          area: area1,
          city: city1,
          province: province1,
          address: this.address,
          company_license: this.company_license,
          self_front_card: this.self_front_card,
          company_phone: this.company_phone,
          company_contact: this.company_contact,
          company_name: this.company_name,
          company_legalname: this.company_legalname,
          areas: JSON.stringify(areaArr),
          is_direct: this.isDirect ? 1 : 0,
        };
      } else {
        form = {
          username: this.username,
          partner_type: 2,
          initial_money: this.initial_money,
          actual_money: this.actual_money,
          wait_money: this.wait_money,
          area: area1,
          city: city1,
          province: province1,
          address: this.address,
          company_license: this.company_license,
          self_front_card: this.self_front_card,
          self_phone: this.company_phone,
          self_name: this.company_contact,
          company_name: this.company_name,
          company_legalname: this.company_legalname,
          areas: JSON.stringify(areaArr),
          is_direct: this.isDirect ? 1 : 0,
        };
      }
      let res = await addAdminPartner(form);
      if (res.code === 10000) {
        this.$message.success(res.message);
        this.cancelAddPartner();
        this.getpartnerProvinceSearchData();
      } else {
        this.$message.error(res.message);
      }
    },
    getFile(file) {
      this[file.name] = file.files.length > 0 ? file.files[0].url : "";
    },
    tc() {
      return "text-align:center; color:#333333; font-size:12px;";
    },
    tccolor() {
      return "text-align:center;background-color:#f5f5f5; font-size:14px;";
    },
    showRedpacketList(item) {
      // this.$router.push({
      //   path: "./isRedPacketsOrder",
      //   query: { serviceId: id, orderType: 20 }
      // });
      this.userForm.id = item.id;
      this.memberId = item.memberId
      this.isShowRedpacketList = true;

    }
  }
};
</script>

<style lang="scss" scoped>
.shop {
  padding: 20px;
}

.kuang {
  margin-top: 5px;
  float: left;
  width: 25%;
  height: 72px;
  text-align: center;
  border: 1px solid #999;

  .top_p {
    color: #999;
    font-size: 13px;
    margin: 12px 0;
  }

  .bottom_p {
    color: #333;
    font-size: 17px;
  }
}

.el-icon-check {
  float: right;
  font-size: 10px;
  font-weight: 700;
}

.pagination {
  float: right;
  margin: 20px 0;
}

.icon_cate {
  float: left;
  margin-left: 14px;
}

.el-icon-remove-outline {
  float: right;
  margin-top: 6px;
  color: #f4222d;
  margin-right: 8px;
  cursor: pointer;
  font-size: 16px;
  font-weight: 700;
}

.forAreas {
  border: 1px solid black;
  width: 90%;
  margin: 5px auto;
  height: 40px;
  text-align: center;
  line-height: 40px;
}

.forAreas span {
  width: 20px;
  height: 20px;
  border-radius: 20px;
  background-color: #000;
  display: inline-block;
  line-height: 20px;
  color: #fff;
}
</style>
